<template>
  <div class="quan">
    <div class="fir">

      <!--左-->
      <div style="display: inline-block; width: 83.5%">
        <el-row>
          <!--常用操作-->
          <div class="onyi">
            <el-col :span="24">
              <el-card shadow="always" style="margin-bottom: 15px">
                <div class="zibox">常用操作</div>
                <!--按钮-->
                <div v-if="role!=='3'"
                     style="margin-left:25px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="tianbao" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./memo.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">填报事件</div>
                  </el-button>
                </div>

                <div v-if="role!=='3'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="caogao" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./caogao.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">呈送事件</div>
                  </el-button>
                </div>

<!--                <div v-if="role!=='3'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="chengsong" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./chuli.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">草稿事件</div>
                  </el-button>
                </div>-->

                <div v-if="role==='1'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="shenhe" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./yiban.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">审核事件</div>
                  </el-button>
                </div>

                <div v-if="role==='1'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="chuli" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./chuli.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">处理事件</div>
                  </el-button>
                </div>
                <div v-if="role==='2'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="zhurenchuli" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./chuli.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">处理事件</div>
                  </el-button>
                </div>

                <div v-if="role!=='3'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="wodeshijian" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./wode.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">我的事件</div>
                  </el-button>
                </div>

                <div v-if="role==='3'"
                     style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="shijiantongji" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./shitong.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">事件统计</div>
                  </el-button>
                </div>

                <div style="margin-left:10px; margin-right: 5px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="tongji" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./tong.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">统计分析</div>
                  </el-button>
                </div>

                <div v-if="role==='3'" style="margin-left:10px; margin-top: 5px; width:80px; display: inline-block">
                  <el-button @click="keshi" class="btn-operate"
                             style="width: 80px;height: 80px;border: none;padding:0; background: white">
                    <img src="./home.png" style="height: 60px; text-align: center; margin-bottom: 2px" alt="图片加载失败">
                    <div class="ziming">科室管理</div>
                  </el-button>
                </div>
              </el-card>
            </el-col>
          </div>

          <!--待办事项-->
          <!--处理事件-->
          <div v-if="role==='2'" class="oner">
            <el-col :span="24">
              <el-card shadow="always">
                <div class="zibox">待办事项</div>

                <!--按钮-->
                <div style="margin-left:25px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="green-button" @click="myEvent"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./meno.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">处理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ wode }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">共提交</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="orang-button" @click="myDaiBan('01','01')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./huan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">患者事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ huanzhe }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="purple-button" @click="myDaiBan('02','01')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./gai.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">整改事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ zhenggai }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 5px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="gblue-button" @click="myDaiBan('03','01')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./guan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">管理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ guanli }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>
              </el-card>
            </el-col>
          </div>
          <!--处理事件-->
          <div v-if="role==='3'" class="oner">
            <el-col :span="24">
              <el-card shadow="always">
                <div class="zibox">待办事项</div>

                <!--按钮-->
                <div style="margin-left:25px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="green-button" style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./meno.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">处理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ wode }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">共提交</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="orang-button" style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./huan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">患者事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ huanzhe }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="purple-button" style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./gai.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">整改事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ zhenggai }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 5px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="gblue-button" style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./guan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">管理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ guanli }}</span>
                      <el-divider content-position="right"></el-divider>
                      <div class="zix">待处理</div>
                    </div>
                  </el-button>
                </div>
              </el-card>
            </el-col>
          </div>

          <!--审核事件-->
          <div v-if="role==='1'" class="oner">
            <el-col :span="24">
              <el-card shadow="always">
                <div class="zibox">待办事项</div>

                <!--按钮-->
                <div style="margin-left:25px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="green-button" @click="myEvent"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./meno.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">审核事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ wode }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">共提交</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="orang-button" @click="myDaiBan('01','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./huan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">患者事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ huanzhe }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待审核</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="purple-button" @click="myDaiBan('02','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./gai.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">整改事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ zhenggai }}</span>
                      <el-divider content-position="right"></el-divider>
                      <div class="zix">待审核</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 5px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="gblue-button" @click="myDaiBan('03','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./guan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">管理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ guanli }}</span>
                      <el-divider content-position="right"></el-divider>
                      <div class="zix">待审核</div>
                    </div>
                  </el-button>
                </div>
              </el-card>
            </el-col>
          </div>
          <!--普通用户-->
          <div v-if="role==='0'" class="oner">
            <el-col :span="24">
              <el-card shadow="always">
                <div class="zibox">待办事项</div>

                <!--按钮-->
                <div style="margin-left:25px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="green-button" @click="myEvent"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./meno.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">我的事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ wode }}</span>
                      <el-divider content-position="right"></el-divider>
                      <div class="zix">共提交</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="orang-button" @click="myDaiBan('01','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./huan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">患者事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ huanzhe }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待上报</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 100px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="purple-button" @click="myDaiBan('02','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./gai.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">整改事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ zhenggai }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待上报</div>
                    </div>
                  </el-button>
                </div>

                <div style="margin-left:50px; margin-right: 5px; margin-top: 8px; width:80px; display: inline-block">
                  <el-button class="gblue-button" @click="myDaiBan('03','03')"
                             style="width: 200px;height: 70px;border: none;padding:0">
                    <div style="width: 40%; display: inline-block">
                      <img src="./guan.png" style="height: 45px; text-align: center; margin-top: 3px" alt="图片加载失败">
                      <div class="zim">管理事件</div>
                    </div>
                    <div style="width: 60%; display: inline-block;position: relative;bottom: 7%">
                      <span class="shu">{{ guanli }}</span>
                      <el-divider content-position="right"/>
                      <div class="zix">待上报</div>
                    </div>
                  </el-button>
                </div>
              </el-card>
            </el-col>
          </div>
        </el-row>
      </div>

      <!--右-->
      <div style="width: 15%; display: inline-block; margin-left: 1.5%">
        <el-card style="height: 250px" shadow="always">
          <div class="ri" style="display: inline-block">{{ nianyue }}</div>
          <div class="zibox" style="display: inline-block">概述</div>

          <div style="margin-left:16px; margin-top: 18px">
            <div style="text-align: left; display: inline-block; color: black">事件总数</div>
            <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">
              {{ overviewList[0] }}
            </div>
            <div style="margin-left:5px; display: inline-block; color: black">件</div>
          </div>

          <div style="margin-left:16px; margin-top: 10px">
            <div style="text-align: left; display: inline-block; color: black">填报科室</div>
            <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">
              {{ overviewList[1] }}
            </div>
            <div style="margin-left:5px; display: inline-block; color: black">个</div>
          </div>

          <div style="margin-left:16px; margin-top: 10px">
            <div style="text-align: left; display: inline-block; color: black">填报人数</div>
            <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">
              {{ overviewList[2] }}
            </div>
            <div style="margin-left:5px; display: inline-block; color: black">人</div>
          </div>

          <div style="margin-left:16px; margin-top: 10px">
            <div style="text-align: left; display: inline-block; color: black">未处理</div>
            <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">
              {{ overviewList[3] }}
            </div>
            <div style="margin-left:5px; display: inline-block; color: black">件</div>
          </div>

          <!--          <div style="margin-left:16px; margin-top: 10px; ">
                      <div style="text-align: left; display: inline-block">处理中</div>
                      <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">{{gaishu5}}</div>
                      <div style="margin-left:5px; display: inline-block; ">件</div>
                    </div>-->

          <div style="margin-left:16px; margin-top: 10px">
            <div style="text-align: left; display: inline-block">处理完成</div>
            <div style="margin-left:5px; display: inline-block; color: dodgerblue; font-weight: 600">
              {{ overviewList[4] }}
            </div>
            <div style="margin-left:5px; display: inline-block">件</div>
          </div>
        </el-card>
      </div>
    </div>

    <!--两个图-->
    <div class="sec">
      <!--事件等级-->
      <div style="display: inline-block; width: 49.5%; margin-right: 1%">
        <el-card>
          <div
            class="echart tu"
            ref="mychart1"
            id="mychart1"
          ></div>
        </el-card>
      </div>

      <!--事件上报趋势-->
      <div style="display: inline-block; width: 49.5%">
        <el-card>
          <div
            class="echart tu"
            ref="mychart"
            id="mychart"
          ></div>
        </el-card>
      </div>
    </div>
  </div>
</template>


<script>
import * as echarts from "echarts"
import {levelListReport, listReport, monthListReport, overviewListReport} from "@/api/module/ljw/shoye";

export default {
  data() {
    return {
      role: '0',
      wode: 0,
      huanzhe: 0,
      zhenggai: 0,
      guanli: 0,
      gaishu1: 0,
      gaishu2: 0,
      gaishu3: 0,
      gaishu4: 0,
      gaishu5: 0,
      gaishu6: 0,
      nianyue: "",
      overviewList: [],
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 事件上报信息表格数据
      reportList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        reportEventNumber: null,
        basicEventId: null,
        reportEventState: null,
        reportEventType: null,
        reportFirstLevel: null,
        reportSecondLevel: null,
        situationEdescriptionProcess: null,
        situationMeasuresEvent: null,
        situationTakenMeasures: null,
        situationCausesconsequences: null,
        patientInvolved: null,
        patientId: null,
        patientNumber: null,
        patientDiagnosisCategory: null,
        patientRecordOutpatient: null,
        patientName: null,
        patientGender: null,
        patientDateOfBirth: null,
        patientAge: null,
        patientAgeStage: null,
        patientEthnicGroup: null,
        patientWeight: null,
        patientPreDisease: null,
        patientContact: null,
        patientFamilyNumber: null,
        patientAdmissionTime: null,
        patientDepartment: null,
        patientBedNumber: null,
        patientNursingLevel: null,
        patientEducationLevel: null,
        patientDiagnosis: null,
        occurrenceTime: null,
        occurrenceDate: null,
        occurrenceDateType: null,
        occurrenceTimePeriod: null,
        occurrenceLocation: null,
        occurrenceScenePhotos: null,
        partyName: null,
        partyAge: null,
        partyYearsOfExperience: null,
        partyCategory: null,
        partyEducation: null,
        partyPosition: null,
        partyPost: null,
        resultsPossibilityDispute: null,
        resultsEventSeverity: null,
        resultsEventClassification: null,
        resultsSeverityInjury: null,
        reportMethod: null,
        reportDepartmentId: null,
        reportDepartment: null,
        reportStatus: null,
        reportFillerId: null,
        reportFiller: null,
        reportTime: null,
        reportAttachedImages: null,
        reportOtherRemarks: null,
        reviewStatus: null,
        reviewDepartmentId: null,
        reviewDepartment: null,
        reviewPersonId: null,
        reviewPerson: null,
        reviewTime: null,
        reviewAdvice: null,
        reviewEventType: null,
        fallbackStatus: null,
        fallbackReason: null,
        fallbackPersonId: null,
        fallbackPerson: null,
        invalidationStatus: null,
        invalidationReason: null,
        invalidationPersonId: null,
        invalidationPerson: null,
        handlingStatus: null,
        handlingOpinions: null,
        handlingPicture: null,
        handingPersonId: null,
        handingPerson: null,
        analyzeReports: null,
        analyzeReportsId: null,
        supportDepartmentOne: null,
        supportOneOpinions: null,
        supportOnePicture: null,
        supportOnePersonId: null,
        supportOnePerson: null,
        supportDepartmentTwo: null,
        supportTwoOpinions: null,
        supportTwoPicture: null,
        supportTwoPersonId: null,
        supportTwoPerson: null,
        eventDeterminatione: null,
        eventDeterminationeDescription: null,
        eventDeterminationePersonId: null,
        eventDeterminationePerson: null,
        note1: null,
        note2: null,
        note3: null,
        note4: null,
        note5: null,
        note6: null,
        note7: null,
        note8: null,
        note9: null,
        note10: null,
        creationTime: null,
        userId: null,
        deptId: null
      },
      // 表单参数
      form: {},
      level: [0, 0, 0, 0],
      month: [
        {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }, {
          value: 0,
          itemStyle: {
            color: '#1E90FF'
          }
        }]
    };
  },
  created() {
    this.currentYear = new Date().getFullYear();

  },
  mounted() {
    if (this.$store.state.user.roles.indexOf('auditor') > -1) {
      this.queryParams.reportFiller = "001"
      this.getDate()
      this.getLevelList();
      this.getMonthlList();
      this.getOverviewList();
      this.daishenhetongji();
      this.role = '1';
    } else if (this.$store.state.user.roles.indexOf('doctor') > -1) {
      /*this.queryParams.reportFillerId=this.$store.state.user.userid
      this.queryParams.reportFiller="007";*/
      // console.log(this.$store.state.user.userid)
      this.getDate()
      this.getLevelList();
      this.getMonthlList();
      this.getOverviewList();
      this.daishangbaotongji();
    } else if (this.$store.state.user.roles.indexOf('processor') > -1) {
      /*this.queryParams.reportFiller="002";
      this.queryParams.reportDepartment=this.$store.state.user.deptid;*/
      // console.log(this.queryParams.reportFiller)
      this.getDate()
      this.getLevelList();
      this.getMonthlList();
      this.getOverviewList();
      this.daibantongji();
      this.role = '2';
    } else {
      /*this.queryParams.reportFiller="002";
      this.queryParams.reportDepartment=this.$store.state.user.deptid;*/
      // console.log(this.queryParams.reportFiller)
      this.getDate()
      this.getLevelList();
      this.getMonthlList();
      this.getOverviewList();
      this.daibantongji();
      this.role = '3';
    }

  },
  methods: {
    getDate() {
      var date1 = new Date();
      var year1 = date1.getFullYear();
      var month1 = date1.getMonth() + 1; // 月份是从0开始计数的，需要加1
      // console.log(year1)
      // console.log(month1)
      var day1 = date1.getDate();
      this.nianyue = year1 + "年" + (month1 < 10 ? "0" + month1 : month1) + "月";
    },
    tianbao() {
      this.$router.push({path: "/hosipitalevent/report"});
    },
    chuli() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/chulishijian", query: {value1, type, state}});
    },
    zhurenchuli() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/zhurenchuli", query: {value1, type, state}});
    },
    wodeshijian() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/wodeshijian", query: {value1, type, state}});
    },
    caogao() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/caogaoshijian", query: {value1, type, state}});
    },
    chengsong() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/caogaoshijian"});
    },
    shenhe() {
      const value1 = true;
      const type = "";
      const state = "";
      this.$router.push({path: "/hosipitalevent/shenhe", query: {value1, type, state}});
    },
    shijiantongji() {
      this.$router.push({path: "/hosipitalevent/shijiantongji"});
    },
    tongji() {
      this.$router.push({path: "/tongji"});
    },
    keshi() {
      this.$router.push({path: "/keshibumen"});
    },
    myEvent() {
      if (this.role === '1') {
        const type = "";
        const state = "";
        this.$router.push({path: "/hosipitalevent/shenhe", query: {type, state}});
      } else if (this.role === '2') {
        const value1 = true;
        const type = "";
        const state = "";
        this.$router.push({path: "/hosipitalevent/zhurenchuli", query: {value1, type, state}});
      } else {
        const type = "";
        const state = "";
        this.$router.push({path: "/hosipitalevent/wodeshijian", query: {type, state}});
      }

    },
    myDaiBan(type, state) {
      if (this.role === '1') {
        this.$router.push({path: "/hosipitalevent/shenhe", query: {type, state}});
      } else if (this.role === '2') {
        const value1 = true;
        this.$router.push({path: "/hosipitalevent/zhurenchuli", query: {value1, type, state}});
      } else {
        this.$router.push({path: "/hosipitalevent/caogaoshijian", query: {type}});
      }
    },
    //查询待处理事件数量
    async getListLength(type, state) {
      //控制事件类型
      this.queryParams.reviewEventType = type;
      this.queryParams.reportEventState = state;
      this.queryParams.reviewStatus = "02"
      this.queryParams.note10 = "01"
      // console.log(this.queryParams.reportFiller)
      const response = await listReport(this.queryParams);
      this.reportList = response.rows;
      // console.log(response.total);
      return response.total || 0;
    },
    //查询待审核事件数量
    async getShenHeLength(type, state) {
      //控制事件类型
      this.queryParams.reviewEventType = type;
      this.queryParams.reviewStatus = state;
      this.queryParams.reportStatus = "02"
      // console.log(this.queryParams.reportFiller)
      const response = await listReport(this.queryParams);
      this.reportList = response.rows;
      // console.log(response.total);
      return response.total || 0;
    },
    //查询待上报事件数量
    async getShangBaoLength(type, state) {
      //控制事件类型
      this.queryParams.reviewEventType = type;
      this.queryParams.reportEventState = state;
      // console.log(this.queryParams.reportFiller)
      const response = await listReport(this.queryParams);
      this.reportList = response.rows;
      // console.log(response.total);
      return response.total || 0;
    },
    getLevelList() {

      levelListReport(this.queryParams).then(response => {
        this.level = response.rows;
        // 在获取数据后再执行bingtu()函数生成饼图
        this.bingtu();

      });
    },
    getOverviewList() {
      this.queryParams.reviewEventType = "";
      this.queryParams.reportEventState = "";
      // console.log(this.queryParams.reportFiller);
      overviewListReport(this.queryParams).then(response => {
        this.overviewList = response.rows;
        // 在获取数据后再执行bingtu()函数生成饼图
      });
    },
    getMonthlList() {
      monthListReport(this.queryParams).then(response => {
        // this.month = response.rows;
        for (let i = 0; i < response.rows.length; i++) {
          this.month[i].value = response.rows[i]
        }
        // 在获取数据后再执行bingtu()函数生成饼图
        this.initEcharts();
      });
    },
    daibantongji() {
      this.queryParams.reviewDepartment = this.$store.state.user.deptid
      this.getListLength("", "").then(result => {
        this.wode = result;
        this.gaishu1 = result;
        // console.log(this.wode);
      });
      this.getListLength("01", "03").then(result => {
        this.huanzhe = result;
      });
      this.getListLength("02", "03").then(result => {
        this.zhenggai = result;
      });
      this.getListLength("03", "03").then(result => {
        this.guanli = result;
      });
      this.queryParams.reviewDepartment = ""
    },
    daishenhetongji() {
      this.queryParams.reportDepartment = this.$store.state.user.deptid
      this.getShenHeLength("", "").then(result => {
        this.wode = result;
        this.gaishu1 = result;
        // console.log(this.wode);
      });
      this.getShenHeLength("01", "03").then(result => {
        this.huanzhe = result;
      });
      this.getShenHeLength("02", "03").then(result => {
        this.zhenggai = result;
      });
      this.getShenHeLength("03", "03").then(result => {
        this.guanli = result;
      });
      this.queryParams.reportDepartment = ""
    },
    daishangbaotongji() {
      this.queryParams.reportFillerId = this.$store.state.user.userId
      this.getShangBaoLength("", "").then(result => {
        this.wode = result;
        this.gaishu1 = result;
        // console.log(this.wode);
      });
      this.getShangBaoLength("01", "01").then(result => {
        this.huanzhe = result;
      });
      this.getShangBaoLength("02", "01").then(result => {
        this.zhenggai = result;
      });
      this.getShangBaoLength("03", "01").then(result => {
        this.guanli = result;
      });
    },
    /*daibantongji(){
      this.wode=this.getListLength("");
      console.log(this.wode)
      this.huanzhe=this.getListLength("01");
      this.zhenggai=this.getListLength("02");
      this.guanli=this.getListLength("03");
    },*/

    // 柱图
    initEcharts() {
      const option = {
        title: {
          text: "事件上报趋势(连续12月)",
          textStyle: {
            color: 'black'
          }
        },
        tooltip: {
          textStyle: {
            color: 'black'
          },
        },
        legend: {
          data: []
        },
        currentYear: new Date().getFullYear(),
        xAxis: {
          type: 'category',
          axisTick: {
            alignWithLabel: true
          },
          axisLabel: {
            interval: 0,
            textStyle: {
              color: 'black'
            },
          },
          data: [this.currentYear + "-01", this.currentYear + "-02", this.currentYear + "-03", this.currentYear + "-04", this.currentYear + "-05", this.currentYear + "-06", this.currentYear + "-07", this.currentYear + "-08", this.currentYear + "-09", this.currentYear + "-10", this.currentYear + "-11", this.currentYear + "-12"]
        },
        yAxis: {
          minInterval: 1,
          axisLabel: {
            textStyle: {
              color: 'black'
            },
          }
        },
        series: [
          {
            name: "",
            type: "bar", //类型为柱状图
            data: this.month
          }
        ]
      };
      const myChart = echarts.init(this.$refs.mychart);// 图标初始化
      myChart.setOption(option);// 渲染页面
      //随着屏幕大小调节图表
      window.addEventListener("resize", () => {
        myChart.resize();
      });
    },

    bingtu() {
      const option1 = {
        title: {
          text: "事件等级(" + this.nianyue + ")",
          textStyle: {
            color: 'black'
          },
        },
        legend: {
          data: ["Ⅰ级事件", "Ⅱ级事件", "Ⅲ级事件", "Ⅳ级事件"],
          bottom: "2%",
          textStyle: {
            color: 'black'
          },
        },
        series: [
          {
            type: "pie", // type设置为饼图
            label: {
              show: true,
              formatter: "{b} : {c} ({d}%)", // b代表名称，c代表对应值，d代表百分比
              textStyle: {
                color: 'black'
              },
            },
            data: [
              {
                value: this.level[0],
                name: "Ⅰ级事件",
                itemStyle: {
                  color: '#FF4040',
                }
              },
              {
                value: this.level[1],
                name: "Ⅱ级事件",
                itemStyle: {
                  color: '#FFB90F',
                }
              },
              {
                value: this.level[2],
                name: "Ⅲ级事件",
                itemStyle: {
                  color: '#1E90FF',
                }
              },
              {
                value: this.level[3],
                name: "Ⅳ级事件",
                itemStyle: {
                  color: '#00CD66',
                }
              }
            ]
          }
        ]
      };
      const myChart1 = echarts.init(this.$refs.mychart1);// 图标初始化
      myChart1.setOption(option1);// 渲染页面
      //随着屏幕大小调节图表
      window.addEventListener("resize", () => {
        myChart1.resize();
      });
    }
  }
}

</script>


<style lang="scss" scoped>

.quan {
  width: 98%;
  margin-top: 1.5%;
  margin-left: 1.5%;
  margin-right: 1.5%;
}

.fir {
  width: 100%;
}

.sec {
  width: 100%;
  display: inline-block;
  margin-top: 10px;
}

.onyi {
  ::v-deep .el-card__body {
    padding: 5px 8px 5px 8px;
    height: 100px;
  }

  ::v-deep .el-card {
    height: 120px;
  }
}

.oner {
  ::v-deep .el-card__body {
    padding: 5px 8px 5px 8px;
    height: 100px;
  }

  ::v-deep .el-card {
    height: 115px;
  }
}

.zibox {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  font-size: 16px;
  font-weight: bolder;
  color: black;
}

.ri {
  color: red;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  font-size: 16px;
  font-weight: bolder;
}

.ziming {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  margin-bottom: 2px;
  margin-top: 2px;
  font-size: 15px;
  font-weight: 500;
  color: black;
}

.ziming:hover {
  color: #1E90FF;
  font-weight: 550;
}

.green-button {
  background-color: #FFB90F;
}

.orang-button {
  background-color: #00CD66;
}

.purple-button {
  background-color: #FF4040;
}

.gblue-button {
  background-color: #1E90FF;
}

.zim {
  font-sixe: 14px;
  font-weight: 550;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  color: #FFFFFF;
  margin-top: 3px;
  margin-bottom: 2px;
  text-align: center;
}

.zix {
  font-weight: 600;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  color: #FFFFFF;
  margin-top: -24px;
  margin-bottom: 4px;
}

::v-deep .el-divider--horizontal {
  background-color: white;
  margin-top: 6px;
  margin-bottom: 32px;
}

.shu {
  font-size: 22px;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
  color: #FFFFFF;
  margin-top: 2px;

}

.tu {
  text-align: center;
  width: 100%;
  height: 525px;
}

.btn-operate:hover {
  .ziming {
    color: #1E90FF;
    font-weight: 550;
  }
}
</style>
